document.getElementById('job-link').addEventListener('click', function () {
    showContent('job-edit');

    fetch('/job/manage', {
        method: 'GET',
        headers: {
            'Content-Type': 'application/json'
        }
    })
        .then(response => response.json())
        .then(data => {
            // 将获取的岗位信息展示在页面上
            var jobManageDiv = document.getElementById('job-manage');
            jobManageDiv.innerHTML = '<h2>岗位管理界面</h2>';
            data.jobs.forEach(job => {
                jobManageDiv.innerHTML += `

<style>
    table {
        border-collapse: collapse;
        width: 100%;
    }

    th, td {
        border: 1px solid black;
        padding: 8px;
        text-align: left;
    }
</style>

<table>
    <tr>
        <td>岗位名称：</td>
        <td>${job.name}</td>
    </tr>
    <tr>
        <td>岗位简介：</td>
        <td>${job.describe}</td>
    </tr>
    <tr>
        <td>要求：</td>
        <td>${job.require}</td>
    </tr>
    <tr>
        <td>福利：</td>
        <td>${job.welfare}</td>
    </tr>
    <tr>
        <td>模式：</td>
        <td>${job.mode}</td>
    </tr>
</table>
<button onclick="delete_job('${job.id}')" class="btn btn-lg btn-primary btn-block">删除岗位</button>
<button onclick="update_job('${job.id}')" class="btn btn-lg btn-primary btn-block">更新岗位</button>
`;
            });
        })
        .catch(error => {
            console.error('Error:', error);
        });
});

function delete_job(jobId) {
    fetch('/job/delete/' + jobId + '/', {
        method: 'DELETE',
        headers: {
            'Content-Type': 'application/json'
        },
        body: JSON.stringify({jobId: jobId})
    })
        .then(response => {
            if (response.ok) {
                location.reload();
            } else {
                throw new Error('删除岗位失败');
            }
        })
        .catch(error => {
            console.error('Error:', error);
        });
}

document.getElementById('add-job').addEventListener('click', function () {
    document.getElementById('job-form').style.display = 'block'; // 显示新增岗位的表单
});

document.getElementById('submit-job').addEventListener('click', function () {
    var jobData = {
        name: document.getElementById('job-name').value,
        describe: document.getElementById('job-describe').value,
        require: document.getElementById('job-require').value,
        welfare: document.getElementById('job-welfare').value,
        mode: document.getElementById('job-mode').value
    };

    fetch('/job/create/', {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json',
        },
        body: JSON.stringify(jobData)
    })
        .then(response => response.json())
        .then(data => {
            alert('岗位新增成功！');
            document.getElementById('job-form').style.display = 'none'; // 隐藏表单
            // 这里可以添加更多的UI逻辑，比如清空表单，刷新列表等
        })
        .catch(error => {
            console.error('Error:', error);
            alert('新增失败，请重试！');
        });
});

function update_job(job_id) {
    var newJobName = prompt('请输入新的岗位名称:');
    var newJobDescription = prompt('请输入新的岗位描述:');
    var newJobRequire = prompt('请输入新的岗位要求:');
    var newJobWelfare = prompt('请输入新的岗位福利:');
    var newJobMode = prompt('请输入新的岗位模式:');

    if (newJobName || newJobDescription || newJobRequire || newJobWelfare || newJobMode) {
        fetch('/job/update/' + job_id + '/', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json'
            },
            body: JSON.stringify({
                name: newJobName,
                description: newJobDescription,
                require: newJobRequire,
                welfare: newJobWelfare,
                mode: newJobMode
            })
        })
            .then(response => {
                if (response.ok) {
                    location.reload();
                } else {
                    throw new Error('更新岗位失败');
                }
            })
            .catch(error => {
                console.error('Error:', error);
            });
    }
}